// a1
window.onload = function () {
  let regtel = /^1[34578]\d{9}$/
  let tel = document.querySelector('#tel')
  // b1
  let qqReg = /^[1-9]\d{4,}$/
  // b4 qqDOM
  let qqEl = document.querySelector('#qq')
  // c1
  let regnc = /^[\u4e00-\u9fa5]{2,8}$/
  let nc = document.querySelector('#nc')
  // d1 短信正则与选择器
  let regmsg = /^\d{4,6}$/
  let dxEl = document.querySelector('#msg')
  // 密码
  let regpwd = /^[a-zA-Z0-9_-]{6,16}$/
  let pwd = document.querySelector('#pwd')

  // f1 确认密码
  let surepwd = document.querySelector('#surepwd')

  // b2 第一个参数，选择器，第二个参数正则
  function regexp(el, reg) {
    el.onblur = function () {
      if (reg.test(this.value)) {
        console.log('正确')
        // a2
        this.nextElementSibling.className = 'success'
        // a3
        this.nextElementSibling.innerHTML = `<i class="success_icon"></i> 正确`
      } else {
        console.log('错误')
        // a4
        this.nextElementSibling.className = 'error'
        this.nextElementSibling.innerHTML = `<i class="error_icon"></i> 手机号码格式不正确`
      }
    }
  }
  // b3
  regexp(tel, regtel)
  // b5
  regexp(qqEl, qqReg)
  // c2
  regexp(nc, regnc)
  // d2
  regexp(dxEl, regmsg)
  // 密码
  regexp(pwd, regpwd)

  // f2
  surepwd.onblur = function () {
    if (this.value && this.value == pwd.value) {
      this.nextElementSibling.className = 'success'
      this.nextElementSibling.innerHTML = '<i class="success_icon"></i> 恭喜您输入正确'
    } else {
      this.nextElementSibling.className = 'error'
      this.nextElementSibling.innerHTML = '<i class="error_icon"></i> 两次密码输入不一致'
    }
  }
}
